<?xml version="1.0" encoding="UTF-8"?>
<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
    <!--<head metal:use-macro="macro/design.xhtml/head"/>-->
    <head metal:use-macro="macro/design.xhtml/head"/>
    <body>
        <div id="container">
            <div metal:use-macro="macro/design.xhtml/top" id='header'>
                <a href="http://iaeste.no"><img class="logo" src="xhtml/design/img/logo_iaeste.gif"/></a>
            </div>
            <div id="main">
                <div id="content">
                    <legend>4. Period</legend>
                    <div id="error">
                         <ul>
                            <li><strong>Invalid firstname:</strong> We want more than 3 letters!</li>
                            <li><strong>Invalid lastname:</strong> We want more than 3 letters!</li>
                            <li><strong>Invalid birthdate:</strong> We want a valid date!!</li>
                            <li><strong>Invalid sex:</strong> You have to choose male/female!</li>
                            <li><strong>Invalid marital status:</strong> You have to choose marital status!</li>
                        </ul>
                    </div>
                    <div id="error" class="valid">
                        <ul>
                            <li><strong>Congratulations!</strong> All personal fields are OK!</li>
                        </ul>
                    </div>
                    <form name="step3" id="customForm" action="" method="post">
                        <div>
                            During which period will you be able to work as an IAESTE trainee?
                        </div>
                        <div>
                            <label for="from">From</label>
                            Day
                            <select name="fromDay">
                                <option tal:repeat="d day" tal:content="d" tal:attributes="value d"></option>
                            </select>
                            Month
                            <select name="fromMonth">
                                <option tal:repeat="m month" tal:content="m" tal:attributes=" value m"></option>
                            </select>
                            Year
                            <select name="fromYear">
                                <option tal:repeat="y year" tal:content="y" tal:attributes="value y"></option>
                            </select>
                        </div>
                        <div>
                            <label for="until">Until</label>
                            Day
                            <select name="untilDay">
                                <option tal:repeat="d day" tal:content="d" tal:attributes="value d"></option>
                            </select>
                            Month
                            <select name="untilMonth">
                                <option tal:repeat="m month" tal:content="m" tal:attributes=" value m"></option>
                            </select>
                            Year
                            <select name="untilYear">
                                <option tal:repeat="y year" tal:content="y" tal:attributes="value y"></option>
                            </select>
                        </div>
                        <div>
                            <label for="min">Minimum</label>
                            <input type="text" name="min"/>
                            What is your desired number of weeks for traineeship?
                        </div>
                        <div>
                            <label for="max">Maximum</label>
                            <input type="text" name="max"/>
                        </div>
                        <div>
                            <label for="applied">Applied before?</label>
                            <select name="appliedbefore">
                                <option value="no">No</option>
                                <option value="yes">Yes</option>
                            </select>
                            Have you applied for IAESTE traineeship in a previous year (or years)?
                        </div>
                        <div>
                            <label for="previous">Previous traineeship?</label>
                            <select name="previous">
                                <option value="no">No</option>
                                <option value="yes">Yes</option>
                            </select>
                            Have you been to an IAESTE-traineeship before?
                        </div>
                        <div>
                            <input id="send" type="submit" class="button" name="pre" value="<< Previous"/>
                            <input id="send" type="submit" class="button" name="next" value="Continue >>"/>
                        </div>
                    </form>
                </div>
            </div>
            <div metal:use-macro="macro/design.xhtml/bottom" id='footer'/>
        </div>
    </body>
</html>